import { setupLayouts } from 'virtual:generated-layouts'
import { createRouter, createWebHistory } from 'vue-router/auto'
import { redirects, routes } from './additional-routes'
import { setupGuards } from './guards'

/**
 * 递归处理路由布局
 * 该函数递归地为路由及其所有子路由应用布局配置
 * 
 * @param {Object} route - 需要处理的路由对象
 * @param {Array} [route.children] - 路由的子路由数组
 * @returns {Object} 处理后的路由对象
 */
function recursiveLayouts(route) {
  if (route.children) {
    for (let i = 0; i < route.children.length; i++)
      route.children[i] = recursiveLayouts(route.children[i])

    return route
  }

  return setupLayouts([route])[0]
}

/**
 * 创建Vue Router实例
 * 配置路由历史模式、滚动行为和路由扩展
 */
const router = createRouter({
  // 使用HTML5历史模式，基于BASE_URL创建路由历史
  history: createWebHistory(import.meta.env.BASE_URL),

  /**
   * 定义页面滚动行为
   * @param {Object} to - 目标路由对象
   * @returns {Object} 滚动行为配置
   */
  scrollBehavior(to) {
    if (to.hash)
      return { el: to.hash, behavior: 'smooth', top: 60 }

    return { top: 0 }
  },

  /**
   * 扩展路由配置
   * 合并自动生成的页面路由、重定向路由和额外路由，并应用布局
   * @param {Array} pages - 自动生成的页面路由数组
   * @returns {Array} 处理后的完整路由配置数组
   */
  extendRoutes: pages => [
    ...redirects,
    ...[
      ...pages,
      ...routes,
    ].map(route => recursiveLayouts(route)),
  ],
})

// 设置路由守卫
setupGuards(router)

// 导出路由实例，供其他模块使用
export { router }

/**
 * 默认导出函数，用于在Vue应用中安装路由插件
 * 
 * @param {Object} app - Vue应用实例
 * @returns {void}
 */
export default function (app) {
  app.use(router)
}
